<template>
    <page-body >
        <view class="page" >
    <view class="flex align-stretch benben-position-layout flex errandsSh_flex_0"    :style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx', }">
            <view   class='flex align-center justify-between flex-sub errandsSh_fd0_0'      >
            <view   class='flex align-center errandsSh_fd0_0_c0'   @tap.stop="handleJumpDiy" data-type="back" data-url="1"   >
        <text class='fu-iconfont2  errandsSh_fd0_0_c0_c0'  >&#xE794;</text>
</view>
    <view   class='flex align-center'      >
        <text class='errandsSh_fd0_0_c1_c0'  >申请售后</text>
</view>
    <view   class='flex align-center errandsSh_fd0_0_c0'      >
        </view>
</view>

        </view>
<view :style="{height: (88+StatusBarRpx)+'rpx'}"  ></view>
<!---flex布局flex布局开始-->
 <view class="flex benben-flex-layout flex-wrap align-center errandsSh_flex_1"    >
        </view>
        
<!---flex布局flex布局结束-->
<!---flex布局flex布局开始-->
 <view class="flex flex-direction flex-wrap align-stretch benben-flex-layout errandsSh_flex_2"    >
            <view   class='flex flex-wrap align-center errandsSh_fd2_0'   @tap.stop="popupShow1716004188390=true"   >
        <text class='errandsSh_fd2_0_c0'  >售后类型</text>
<benben-input class='flex-sub errandsSh_fd2_0_c1'   type="text" :placeholder="`请选择`" confirm-type="done" :maxlength="-1" :adjust-position='true' :disabled='true' placeholder-style="color:#999;font-size:32rpx"  v-model="shLable" />
<image class='errandsSh_fd2_0_c2'  mode="aspectFit"  :src='STATIC_URL+"38.png"'></image>
</view>
    <view   class='flex flex-wrap align-center errandsSh_fd2_0'   @tap.stop="popupShow1716002269216=true"   >
        <text class='errandsSh_fd2_0_c0'  >售后原因</text>
<benben-input class='flex-sub errandsSh_fd2_0_c1'   type="text" :placeholder="`请选择退款原因`" confirm-type="done" :maxlength="-1" :adjust-position='true' :disabled='true' placeholder-style="color:#999;font-size:32rpx"  v-model="refundLable" />
<image class='errandsSh_fd2_0_c2'  mode="aspectFit"  :src='STATIC_URL+"38.png"'></image>
</view>
<text class='errandsSh_fd2_2'  >售后说明</text>
<view class='flex flex-wrap errandsSh_fd2_3'>
<textarea class='flex errandsSh_input_fd2_3'  :placeholder="'申请售后，请在此描述申请售后服务的原因'" :adjust-position='true' :maxlength="800" :show-num='true' placeholder-style="color:rgba(191, 191, 191, 1);font-size:28rpx"   v-model="fd2_3" />
<template>    <view   class='flex flex justify-end errandsSh_numberfd2_3_c0'      >
        <text class='errandsSh_numberfd2_3_c0_c0'  >{{fd2_3.length}}</text>
<text class='errandsSh_numberfd2_3_c0_c0'  >/</text>
<text class='errandsSh_numberfd2_3_c0_c0'  >800</text>
</view>
</template>
</view>
    <benben-images-upload  ref="benbenImagesUploadfd2_4"   :maxlength="9" >
    <template #content="{ num, maxlength, isShow, imgList }">
     <view class="flex flex-wrap align-start flex" >
            
    <view v-for="(image, index) in imgList" :key="index"  class='flex position-relative errandsSh_fd2_40'      >
        <text class='fu-iconfont2 position-absolute errandsSh_fd2_400'   @tap.stop="$refs.benbenImagesUploadfd2_4.delImage(index)">&#xE8E7;</text><image class='errandsSh_fd2_401'  @tap.stop="$refs.benbenImagesUploadfd2_4.previewImage(index)" mode="aspectFill"  :src='image'></image>
    </view>
    
            <image class='errandsSh_fd2_41'  @tap.stop="$refs.benbenImagesUploadfd2_4.manyChooseImage()"  v-if="isShow" mode="aspectFit"  :src='STATIC_URL+"34.png"'></image>
            
          </view>
        </template>
    </benben-images-upload>
</view>
        
<!---flex布局flex布局结束-->
<benben-popup v-model="popupShow1716002269216" :mask="true" :mask-close-able="true"  mode='bottom' >
    <!---售后原因弹窗flex布局开始-->
 <view class="flex flex-direction flex-wrap align-stretch benben-flex-layout errandsSh_flex_3"    >
            <view   class='flex flex-wrap align-center justify-between errandsSh_fd3_0'      >
        <text class='errandsSh_fd3_0_c0'     @tap.stop="popupShow1716002269216=false" >取消</text>
<text class='errandsSh_fd3_0_c1'  >售后原因</text>
<text class='errandsSh_fd3_0_c2'     @tap.stop="popupShow1716002269216=false" >确定</text>
</view>
<text class='errandsSh_fd3_1'  >请选择售后原因</text>
    <benben-select-diy ref="showSelectPopup1716002823756" class-name='flex flex-direction align-stretch flex errandsSh_fd3_2'  :items.sync="refundType" v-model="refund_id" :label.sync="refundLable"  default-type="value" default-label="name" :allow-cancel='false' type="radio" :disabled='false'  >
    <template v-for = '(item,key0) in refundType'>
            <view v-if="item.isSelected"  class='flex align-center justify-between flex errandsSh_fd3_2_c0'  :key="key0" @tap="$refs.showSelectPopup1716002823756.tapHandle(key0)"     >
        <text class='errandsSh_fd3_2_c0_c0'  >{{item.name}}</text>
<image class='errandsSh_fd3_2_c0_c1'  mode="aspectFit"  :src='STATIC_URL+"2.png"'></image>
</view>    <view  v-else  class='flex align-center justify-between flex errandsSh_fd3_2_c0'  :key="key0" @tap="$refs.showSelectPopup1716002823756.tapHandle(key0)"     >
        <text class='errandsSh_fd3_2_c0_c0'  >{{item.name}}</text>
<image class='errandsSh_fd3_2_c0_c1'  mode="aspectFit"  :src='STATIC_URL+"3.png"'></image>
</view></template></benben-select-diy>
</view>
        
<!---售后原因弹窗flex布局结束-->
    
</benben-popup>
<benben-popup v-model="popupShow1716004188390" :mask="true" :mask-close-able="true"  mode='bottom' >
    <!---售后类型弹窗flex布局开始-->
 <view class="flex flex-direction flex-wrap align-stretch benben-flex-layout errandsSh_flex_4"    >
            <view   class='flex flex-wrap align-center justify-between errandsSh_fd4_0'      >
        <text class='errandsSh_fd4_0_c0'     @tap.stop="popupShow1716004188390=false" >取消</text>
<text class='errandsSh_fd4_0_c1'  >请选择售后类型</text>
<text class='errandsSh_fd4_0_c2'     @tap.stop="popupShow1716004188390=false" >确定</text>
</view>
    <benben-select-diy ref="showSelectPopup1716004634845" class-name='flex flex-direction align-stretch flex errandsSh_fd4_1'  :items.sync="shTypes" v-model="sh_id" :label.sync="shLable"  default-type="value" default-label="name" :allow-cancel='false' type="radio" :disabled='false'  >
    <template v-for = '(item,key0) in shTypes'>
            <view v-if="item.isSelected"  class='flex align-center flex errandsSh_fd4_1_c0'  :key="key0" @tap="$refs.showSelectPopup1716004634845.tapHandle(key0)"     >
        <text class='errandsSh_fd4_1_c0_c0'  >{{item.name}}</text>
<image class='errandsSh_fd4_1_c0_c1'  mode="aspectFit"  :src='STATIC_URL+"2.png"'></image>
</view>    <view  v-else  class='flex align-center flex errandsSh_fd4_1_c0'  :key="key0" @tap="$refs.showSelectPopup1716004634845.tapHandle(key0)"     >
        <text class='errandsSh_fd4_1_c0_c0'  >{{item.name}}</text>
<image class='errandsSh_fd4_1_c0_c1'  mode="aspectFit"  :src='STATIC_URL+"3.png"'></image>
</view></template></benben-select-diy>
</view>
        
<!---售后类型弹窗flex布局结束-->
    
</benben-popup>
    <view class="flex flex-wrap align-start justify-center benben-position-layout flex errandsSh_flex_5"    >
        <button class='errandsSh_fd5_0'   >提交</button>

        </view>
<view :style="{height: '120rpx'}"  ></view>
    
    
        </view>
    </page-body>
</template>
<script>
    
    
    export default {
        components:{},
        
        
        data(){
			return {"popupShow1716004188390":false,"popupShow1716002269216":false,"fd2_3":"","refundType":[{"name":"不好吃","value":"1","image":""},{"name":"少产品","value":"2","image":""},{"name":"送完了","value":"3","image":""}],"refund_id":"","shTypes":[{"name":"全部退款","value":"1","image":""},{"name":"部分退款","value":"2","image":""}],"sh_id":"","refundLable":"","shLable":"","aid":""};
		},
		computed:{
            
		},
		watch:{},
		onLoad(options){
            let {aid}=options
if (aid !== undefined) this.aid = aid
		},
        onUnload() {
                
        },
		onReady(){
            
		},
		onShow(){
            
		},
		onHide(){
            
		},
		onResize(){
            
		},
		onPullDownRefresh(){
            
		},
		onReachBottom(e){
            
		},
		onPageScroll(e){
            
		},
		methods:{
            
		}
    };
</script> 
<style lang="scss" scoped>
           .page{
            width: 100vw;
            overflow-x: hidden;
            min-height: calc(100vh - var(--window-bottom));
            background:#fff;background-size: 100% auto;
        }
    .errandsSh_flex_0{
        background:#fff;width:750rpx;height:88rpx;overflow:hidden;z-index:10;top:0rpx;background-size:100% auto !important;
    }
    .errandsSh_fd0_0_c1_c0{
        font-size:36rpx;font-weight:500;color:#333;
    }
    .errandsSh_fd0_0_c0_c0{
        font-size:32rpx;font-weight:500;color:#333;
    }
    .errandsSh_fd0_0_c0{
        width:180rpx;
    }
    .errandsSh_fd0_0{
        padding:0rpx 32rpx 0rpx 32rpx;line-height:88rpx;
    }
    .errandsSh_flex_1{
        background:rgba(246, 247, 249, 1);height:20rpx;background-size:100% auto;
    }
    .errandsSh_flex_2{
        padding:0rpx 32rpx 0rpx 32rpx;
    }
    .errandsSh_fd2_41{
        width:180rpx;height:180rpx;margin:0rpx 24rpx 24rpx 0rpx;border-radius:16rpx;
    }
    .errandsSh_fd2_401{
        width:180rpx;height:180rpx;border-radius:16rpx;
    }
    .errandsSh_fd2_400{
        top:0rpx;right:0rpx;z-index:10;color:#ff5536;
    }
    .errandsSh_fd2_40{
        margin:0rpx 24rpx 24rpx 0rpx;
    }
    .errandsSh_numberfd2_3_c0_c0{
        color:#8E8E93;font-size:24rpx;font-weight:400;line-height:33rpx;
    }
    .errandsSh_numberfd2_3_c0{
        width:100%;font-size:24rpx;color:#FFFFFF;line-height:46rpx;font-weight:400;
    }
    .errandsSh_input_fd2_3{
        width:100%;height:260rpx;font-size:28rpx;font-weight:400;color:#333;white-space:pre-wrap;
    }
    .errandsSh_fd2_3{
        background:rgba(246, 247, 249, 1);border-radius:10rpx 10rpx 10rpx 10rpx;padding:24rpx 24rpx 24rpx 24rpx;margin:0rpx 0rpx 20rpx 0rpx;
    }
    .errandsSh_fd2_2{
        color:#333333;font-size:32rpx;font-weight:500;line-height:45rpx;margin:32rpx 0rpx 32rpx 0rpx;
    }
    .errandsSh_fd2_0_c2{
        width:12rpx;height:22rpx;margin:0rpx 0rpx 0rpx 22rpx;
    }
    .errandsSh_fd2_0_c1{
        text-align:right;margin:0rpx 0rpx 0rpx 24rpx;font-size:32rpx;font-weight:400;color:#333;
    }
    .errandsSh_fd2_0_c0{
        color:#333333;font-size:32rpx;font-weight:500;line-height:45rpx;text-align:left;font-style:normal;
    }
    .errandsSh_fd2_0{
        border-bottom:1px solid #eee;padding:32rpx 0rpx 32rpx 0rpx;
    }
    .errandsSh_flex_3{
        background:#fff;background-size:100% auto !important;border-radius:24rpx 24rpx 0rpx 0rpx;padding:0rpx 0rpx 17rpx 0rpx;
    }
    .errandsSh_fd3_2_c0_c1{
        width:36rpx;height:36rpx;
    }
    .errandsSh_fd3_2_c0_c0{
        line-height:45rpx;font-size:32rpx;font-weight:400;color:#333333;
    }
    .errandsSh_fd3_2_c0{
        margin:0rpx 0rpx 40rpx 0rpx;
    }
    ::v-deep .errandsSh_fd3_2{
        padding:40rpx 24rpx 0rpx 24rpx;
    }
    .errandsSh_fd3_1{
        background:rgba(246, 247, 249, 1);padding:0rpx 24rpx 0rpx 24rpx;line-height:90rpx;font-size:28rpx;font-weight:400;color:#666666;background-size:100% auto !important;
    }
    .errandsSh_fd3_0_c2{
        line-height:45rpx;font-size:32rpx;font-weight:400;color:var(--benbenFontColor4);
    }
    .errandsSh_fd3_0_c1{
        line-height:50rpx;font-size:36rpx;font-weight:700;color:#333333;
    }
    .errandsSh_fd3_0_c0{
        line-height:45rpx;font-size:32rpx;font-weight:400;color:#999999;
    }
    .errandsSh_fd3_0{
        height:114rpx;padding:0rpx 24rpx 0rpx 24rpx;
    }
    .errandsSh_flex_4{
        background:#fff;background-size:100% auto !important;border-radius:24rpx 24rpx 0rpx 0rpx;padding:0rpx 0rpx 17rpx 0rpx;
    }
    .errandsSh_fd4_1_c0_c1{
        width:36rpx;height:36rpx;margin:0rpx 0rpx 0rpx auto;
    }
    .errandsSh_fd4_1_c0_c0{
        line-height:45rpx;font-size:32rpx;font-weight:400;color:#333333;
    }
    .errandsSh_fd4_1_c0{
        margin:0rpx 0rpx 40rpx 0rpx;
    }
    ::v-deep .errandsSh_fd4_1{
        padding:0rpx 24rpx 0rpx 24rpx;
    }
    .errandsSh_fd4_0_c2{
        line-height:45rpx;font-size:32rpx;font-weight:400;color:var(--benbenFontColor4);
    }
    .errandsSh_fd4_0_c1{
        line-height:50rpx;font-size:36rpx;font-weight:700;color:#333333;
    }
    .errandsSh_fd4_0_c0{
        line-height:45rpx;font-size:32rpx;font-weight:400;color:#999999;
    }
    .errandsSh_fd4_0{
        padding:0rpx 24rpx 0rpx 24rpx;margin:32rpx 0rpx 50rpx 0rpx;
    }
    .errandsSh_flex_5{
        width:750rpx;height:120rpx;overflow:hidden;z-index:10;bottom:calc(0rpx + var(--window-bottom));
    }
    .errandsSh_fd5_0{
        background:#FF8E21;border-radius:44rpx 44rpx 44rpx 44rpx;width:686rpx;line-height:80rpx;font-size:32rpx;color:#fff;height:80rpx;
    }
</style>